import React, { Component } from 'react';
import '../styles/Feixianghd.scss'
import { NavBar, SearchBar, Space } from 'antd-mobile'
import { SearchOutline, MoreOutline} from 'antd-mobile-icons'
import * as service from '../api/index'

class Feixianghd extends Component {
    constructor(props) {
        super(props)
        this.state = {
          right: (
            <div style={{ fontSize: 24 }}>
              <Space style={{ '--gap': '16px' }}>
                <SearchOutline />
                <MoreOutline />
              </Space>
            </div>
          ),
          huodong:[]
        }
      }
      async componentDidMount(){
        var res=await service.user_huodong()
        this.setState({huodong:res.data})
       }
    render() {
        return (
            <div className='feixianghd'>
               <NavBar  right={this.state.right} onBack={()=>{this.props.history.go(-1)}}>
               非翔活动
                </NavBar>
                <div className='shuru'>
                <SearchBar placeholder='搜索课程/头条/活动'/>
                </div>
                <div className="nei">
                {
                  this.state.huodong.map((item,index)=>{
                    return (
                      <div className='item' key={index} onClick={()=>{this.props.history.push('/houdongxx')}}>
                        <div className='pic'><img src={item.pic} alt="" /></div>
                        <div className='pi'>
                          <div className='name'>{item.name}</div>
                          <div className='xian'>
                            <span className={item.status==2?'active':item.status==3?'active1':''}>{item.text}</span>
                            <span>{item.text1}</span>
                          </div>
                        </div>
                      </div>
    
                    )
                  })
                }
                </div>
            </div>
        );
    }
}

export default Feixianghd;